Printing services Web sites that allow a user to access the site from the user's home or work and design a personalized document are well known and widely used by many consumers, professionals, and businesses. Typically, these types of sites allow the user to review thumbnail images of a number of customizable designs prepared by the site operator with a variety of different styles, formats, backgrounds, color schemes, fonts and designs from which the user may choose. When the user has selected a specific template design to customize, the sites typically provide online tools allowing the user to incorporate the user's personal information into the selected template to create a custom document design. When the design is completed to the user's satisfaction, the user can place an order through the site for production and delivery of a desired quantity of the corresponding printed product.
One very common printed product that is often ordered through printing services sites is the business card. The type of information that is normally provided on a typical business card is well known and can be fairly reliably predicted. To facilitate the easy and rapid preparation of a business card, printing services sites often provide a simple text entry tool that can be easily used by customers with little or no online product design experience.
Referring to FIG. 1, a representative online business card creation screen displayed to a user at the user's computer system is depicted. In this example, text entry fields 101-111 into which the user can type the desired information are provided. To assist the user, each text entry field 101-111 has an associated text label indicating the specific information the services provider recommends that the user enter into that field. For example, field 101 is indicated as the field for entering the user's company name, field 102 is the field for the user's company message, and so forth. The fields are normally empty when initially displayed to the user.
Template image 120 is the particular business card design template selected by the user for customization. In the example shown in FIG. 1, template image 120 contains an image area 121 and a text entry area 122. Template 120 is merely representative and other template designs could have one or more images of different sizes and/or positions or no images at all.
The service provider will typically have specified a default font, font size, and other font characteristics in which each user text entry will be displayed. To illustrate to the user the location and appearance of the user's information as it will appear in the design, generic text entries such as “Company Name”, “Full Name” and so forth are initially displayed in template 120. Preview button 130 is provided to allow the user to cause template 120 to be updated to replace the default generic text information in text area 122 with the information entered by the user in fields 101-111. Display 100 may also include various other items, not shown, such as informational, navigational, and promotional banners, messages and links.
Because the user is interacting with the service provider's site using a Web browser program running on the user's computer system, the document creation tools and displays are provided by the server to the user's computer in a markup language such as XHTML (extensible Hypertext Markup Language) suitable for execution by the browser program. What the user sees on the user's display as the design of a business card is the result of the browser's rendering of a collection of discrete markup language elements.
Each text entry field 101-111 is associated with an individual textbox. The individual textbox elements of template 120 are depicted for illustration in FIG. 2. Text entry fields 101-111 correspond to textboxes 201-211. As is well understood by those of skill in the art, each textbox element will have a number of associated parameters. Some parameters relate to the displaying of the text in the textbox, such as the font to be used, font size, font color, and font attributes such as bolding or italics. Other parameters relate to the textbox itself, such as the width of the textbox, the absolute or relative position of the textbox, and whether or not text wrapping is enabled.
In a typical prior art application of this type of design system, each textbox element is assigned a fixed absolute position within the overall template 120 design. For example, the horizontal and vertical pixel offset of the upper left corner of each textbox, such as corner 220 of text box 201, relative to the upper left corner 221 of the template 120 image is defined for each textbox 201-211. While this type of inflexible design may result in an acceptable finished product in many cases, in some situations the product design will be aesthetically unpleasing or possibly so defective as to be completely unusable.
While template 120 has been designed to yield a pleasing card containing eleven common business card data entries, some users have no use or desire for eleven different entries. The user is not forced to make an entry in each field and may choose to leave one or more fields empty. If a user makes entries in only a few of the fields, spacing between entries in the product design may be uneven and unattractive. For example, if a user entered only a company name in text field 101, a name in text field 103, and a Web address in field 111, the resulting three lines of information displayed in textboxes 201, 203 and 211 would be widely separated over almost the entire height of the card.
Another drawback in the prior art is that the template 120 layout design anticipates that all entries by a user will fit on one line. A problem is created if the user enters more text than the textbox can accommodate on a single line. If text wrapping for a textbox is not enabled, the user's desired text will exceed the line capacity and will be truncated. If text wrapping is enabled, when the user's text exceeds the capacity of a single line, the text will be wrapped onto a second line, often resulting in the text content of one textbox overlapping the text content of another textbox, creating an unusable design. Both of these situations are clearly undesirable.
There is, therefore, a need for a flexible design layout method that automatically adjusts the design according to the text entries made by the user.